<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Event 事件</title>
</head>
<body>
<form action="">
    <!--&#45;onfocus 获取焦点   onblur 失去焦点-->
    <input id="search" type="text" value="请输入用户名" onfocus="f1()" onblur="f2()">

    <script>
        var ele=document.getElementById('search');
        function f1() {
           if(ele.value=="请输入用户名"){
               ele.value=" "
           }
        }
        function f2() {
            // .trim()去空格
            if(!ele.value.trim()){
                ele.value="请输入用户名"
            }
        }
    </script>
</form>
</body>
</html>